<%@ page pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@ taglib uri="/mytags" prefix="q"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>君乐宝酸奶管理系统-销售订单列表</title>
<link rel="stylesheet" href="${ctx}/bootstrap3/css/bootstrap.min.css">
<link rel="stylesheet" href="${ctx}/css/my.css">
<link href="${ctx}/My97DatePicker/skin/WdatePicker.css" rel="stylesheet">
<script src="${ctx}/My97DatePicker/WdatePicker.js"></script>
</head>
<body>
	<!-- 导航条 -->
	<jsp:include page="/mng/nav.jsp" />
	<!-- /导航条 -->

	<!-- 主容器 -->
	<div class="container" style="margin-top: 76px">
		<div class="row">
			<!-- 功能菜单 -->
			<jsp:include page="/mng/menu.jsp" />
			<!-- /功能菜单 -->

			<!-- 主界面 -->
			<div id="main" class="main col-md-9">
				<!-- 路径导航 -->
				<ol class="breadcrumb" style="border-radius: 0; background: #fff;">
					<li><a href="${ctx}/mng/main.jsp">首页</a></li>
					<li><a href="#">销售管理</a></li>
					<li class="active">销售订单列表</li>
				</ol>
				<!-- /路径导航 -->

				<!-- 查询表单 -->
				<div class="row">
					<form class="form-horizontal" role="from"
						action="${ctx}/mng/sale/find.jhtml" method="get">
						<div class="form-group">
							<label class="col-md-2 control-label"
								style="margin-bottom: 15px;">按状态查询</label>
							<div class="col-md-3">
								<select class="form-control" name="status" id="status">
									<option value="-1">所有订单</option>
									<c:if test="${param.status == 0}">
										<option value="0" selected="selected">草稿</option>
									</c:if>
									<c:if test="${param.status != 0}">
										<option value="0">草稿</option>
									</c:if>
									<c:if test="${param.status == 1}">
										<option value="1" selected="selected">已出单</option>
									</c:if>
									<c:if test="${param.status != 1}">
										<option value="1">已出单</option>
									</c:if>
									<c:if test="${param.status == 2}">
										<option value="2" selected="selected">已出库</option>
									</c:if>
										<c:if test="${param.status != 2}">
										<option value="2">已出库</option>
									</c:if>
								</select>
							</div>
						</div>
						<div class="form-group">
							<label class="col-md-2 control-label">请选择日期</label>
							<div class="col-md-3 col-xs-2 ">
								<input class="form-control" type="text" name="startDate"
									id="startDate" value="${startDate}" onclick="WdatePicker()"
									style="background: url('${ctx}/img/datepicker_icon.png') no-repeat right 0;" />
							</div>
							<div class="col-md-3 col-xs-2">
								<input class="form-control" type="text" name="endDate"
									id="endDate" value="${endDate}" onclick="WdatePicker()"
									style="background: url('${ctx}/img/datepicker_icon.png') no-repeat right 0;" />
							</div>
							<div>
								<button class="btn btn-primary col-md-offset-2">开始查询</button>
							</div>
						</div>
					</form>

				</div>
				<!-- /查询表单 -->

				<!-- 数据表格 -->
				<table class="table table-bordered table-striped table-hover">
					<thead>
						<tr>
							<th>销售日期</th>
						<th>单据号</th>
						<th>客户</th>
						<th>总金额</th>
						<th>制单人</th>
						<th>状态</th>
						<th>备注</th>
						<th>操作</th>
						</tr>
					</thead>
					<tbody>
						<c:forEach items="${page.content}" var="sale">
							<tr>
								<td><fmt:formatDate value="${sale.sale_date}"
										pattern="YYYY-MM-dd" /></td>
								<td>${sale.sn}</td>
								<td>${sale.customer.lname}</td>
								<td>${sale.cost}</td>
								<td>${sale.manager.lname}</td>
								<td><c:if test="${sale.status == 0}">草稿</c:if>
								 <c:if test="${sale.status == 1}">已出单</c:if>
								 <c:if test="${sale.status == 2}">已出库</c:if></td>
								<td>${sale.remark}</td>
								<td><c:if test="${sale.status == 0}">
										<a
											href="${ctx}/mng/sale/place.jhtml?id=${sale.id}&number=${page.number}"><i
											class="glyphicon glyphicon-edit">出单</i></a>
										<a
											href="${ctx}/mng/sale/detail.jhtml?id=${sale.id}&number=${page.number}"><i
											class="glyphicon glyphicon-edit">编辑</i></a>
									</c:if> 
									<c:if test="${sale.status == 1}">
									<a
											href="${ctx}/mng/sale/iuku.jhtml?id=${sale.id}&number=${page.number}"><i
											class="glyphicon glyphicon-edit">出库</i></a>
									</c:if>
											<a
											href="${ctx}/mng/sale/detail2.jhtml?id=${sale.id}&number=${page.number}"><i
											class="glyphicon glyphicon-edit">详情</i></a>
											<a
											href="${ctx}/mng/sale/delete.jhtml?id=${sale.id}&number=${page.number}"
											class="del"><i class="glyphicon glyphicon-remove">删除</i></a>
									</td>
							</tr>
						</c:forEach>
					</tbody>
				</table>
				<!-- /数据表格 -->

				<!-- 分页 -->
				<div class="row">
					<div class="col-md-2">
						<a class="btn btn-primary" href="${ctx}/mng/sale/toAdd.jhtml">新增订单</a>
					</div>
					<div class="col-md-10">
						<q:pager totalElements="${page.totalElements}"
							number="${page.number}" size="${page.size}"
							url="${ctx}/mng/sale/find.jhtml" />
					</div>
				</div>
				<!-- /分页 -->

			</div>
			<!-- /主界面 -->
		</div>
	</div>

	<!-- 模态框 -->
	<div class="modal fade" id="yourModal" tabindex="-1" role="dialog"
		aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog modal-sm">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal">
						<span aria-hidden="true">&times;</span><span class="sr-only">Close</span>
					</button>
					<h4 class="modal-title" id="myModalLabel">
						<span class="glyphicon glyphicon-warning-sign"
							style="color: #cc0000;"> 删除确认</span>
					</h4>
				</div>
				<div class="modal-body">
					<h5>不可恢复删除，您确定吗？</h5>
				</div>
				<div class="modal-footer">
					<button type="button" id="doDel" class="btn btn-primary">确认删除</button>
					<button type="button"  class="btn btn-primary" data-dismiss="modal">取消</button>
				</div>
			</div>
		</div>
	</div>
	<!-- /模态框 -->

	<script src="${ctx}/js/jquery-1.11.1.min.js"></script>
	<script src="${ctx}/bootstrap3/js/bootstrap.min.js"></script>
	<script src="${ctx}/js/my.js"></script>
	<script>
		$(document).ready(function() {
			$(".del").click(function() { //给本页面的所有的“删除”超链接添加“点击事件”处理函数
				var href = $(this).attr("href"); //获取当前点击的超链接的href值

				$("#yourModal").modal("show"); //显示模态框

				//当点击“确认删除”按钮时，执行一次性事件处理函数
				$("#doDel").one("click", function() {
					location.assign(href); //加载指定链接值的目标资源
				});

				return false; //阻止元素本身的默认行为
			});
		});
	</script>
</body>
</html>